<!--
  * 项目 详情
-->
<template>
  <div class="detail-header">
    <a-page-header :title="detail.name" >
      <template #extra>
        <a-button v-if="detail.state===1 " @click="showAdd" type="primary">新增项目周报</a-button>
      </template>
      <div>
        <a-descriptions size="small" :column="3">
          <a-descriptions-item label="上级项目名称">{{ detail.parentName }}</a-descriptions-item>
          <a-descriptions-item label="任务类型">{{ detail.typeName }}</a-descriptions-item>
          <a-descriptions-item label="负责人">{{ detail.implementerName }}</a-descriptions-item>
          <a-descriptions-item label="计划开始">{{ detail.planBegin }}</a-descriptions-item>
          <a-descriptions-item label="计划结束">{{ detail.planEnd}}</a-descriptions-item>
          <a-descriptions-item v-if=" detail.type===5 " label="采集阶段">{{ detail.collectStateName }}</a-descriptions-item>
          <a-descriptions-item label="项目状态" >{{ detail.stateName }}</a-descriptions-item>
          <a-descriptions-item label="业务人员">{{ detail.businessImplementerName }}</a-descriptions-item>
          <a-descriptions-item label="描述">{{ detail.remark }}</a-descriptions-item>
        </a-descriptions>
      </div>
    </a-page-header>
  </div>
  <a-card class="smart-margin-top10" size="small">
    <a-tabs>
      <a-tab-pane key="employee" tab="项目周报信息">
        <ProjectDetailList ref="projectDetailListRef" :projectId="projectId" :state="detail.state"/>
      </a-tab-pane>
    </a-tabs>
    <ProjectDetailOperateModal ref="taskDetailOpertRef" @refresh="getDetail" />
  </a-card>
</template>

<script setup lang="ts">
  import _ from 'lodash';
import { computed, onMounted, ref } from 'vue';
import { useRoute } from 'vue-router';
import ProjectDetailList from './components/project-detail-list.vue';
import { projectApi } from '/@/api/task/project-api';
import { SmartLoading } from '/@/components/framework/smart-loading';
import { smartSentry } from '/@/lib/smart-sentry';
import ProjectDetailOperateModal from './components/project-detail-operate-modal.vue';

  const route = useRoute();
  let projectId = ref();
  onMounted(() => {
    if (route.query.projectId) {
      projectId.value = route.query.projectId;
      getDetail();
    }
  });

  let detail = ref({});
  let taskDetailOpertRef=ref();
  let projectDetailListRef=ref();

  function showAdd(){
    let record={"projectId":projectId.value};
    taskDetailOpertRef.value.showModal(record);
  }

  async function getDetail() {
    try {
      let result = await projectApi.detail(projectId.value);
      detail.value = result.data;
      projectDetailListRef.value.queryTaskDetail();
    } catch (error) {
      smartSentry.captureError(error);
    } finally {
      SmartLoading.hide();
    }
  }
</script>

<style lang="less" scoped>
  .detail-header {
    background-color: #fff;
    padding: 10px;
  }
</style>
